<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>123</h1>
    <hr>
    <div>
        换背景色
        <button onclick="fn1('red')">红</button>
        <button onclick="fn1('blue')">蓝</button>
    </div>
    <div>
        换文字颜色
        <button onclick="fn2('white')">白</button>
        <button onclick="fn2('gray')">灰</button>
    </div>
    <div>
        <button onclick="save()">保存</button>
    </div>
    <script>
        // 类似vuex
        var obj = {
            bgColor:'red',
            color:'white'
        }

        function fn1(color){
            obj.bgColor = color 
        }





        function fn2(color){
            obj.color = color 
        }

        function save(){
            document.body.style.backgroundColor = obj.bgColor 
            document.body.style.color = obj.color
        }

    </script>
</body>
</html>